<template>
    <div class='sep'>
       <span>-</span>
       <span>{{number}}</span>
       <span @click="add">+</span>
    </div>
</template>

<script>
export default {
    props:{
     number: [Number,String]
    },
    data() {
      return {
        num: null,
      };
    },
    created() {
      this.num = this.number;
    },
    // 单项数据流
    methods: {
      add(){
        this.$emit('update:number',this.num++);
      }
    },
    components:{}
};
</script>

<style lang='scss'>
  .sep{
    display: flex;
    height: 40px;
    align-items: center;
    width: 200px;
    justify-content: space-around;
  }
</style>
